import { computed, defineComponent, ref } from 'vue';
import Angle from './Angle.vue';
import Basic from './Basic.vue';
import DisableReadonly from './DisableReadonly.vue';
import InnerMinMax from './InnerMinMax.vue';
import MinMax from './MinMax.vue';
import NativeForm from './NativeForm.vue';
import ShowValue from './ShowValue.vue';
import Step from './Step.vue';

export default defineComponent({
  name: 'App',
  props: {},
  emits: [],

  setup(props, { attrs, emit, expose, slots }) {
    expose({});

    return () => {
      return (
        <div class='block'>
          <div class='block-'>
            <h5 class='title'>Angle</h5>
            <Angle />
          </div>
          <div class='block-'>
            <h5 class='title'>Basic</h5>
            <Basic />
          </div>
          <div class='block-'>
            <h5 class='title'>DisableReadonly</h5>
            <DisableReadonly />
          </div>
          <div class='block-'>
            <h5 class='title'>InnerMinMax</h5>
            <InnerMinMax />
          </div>
          <div class='block-'>
            <h5 class='title'>MinMax</h5>
            <MinMax />
          </div>
          <div class='block-'>
            <h5 class='title'>NativeForm</h5>
            <NativeForm />
          </div>
          <div class='block-'>
            <h5 class='title'>ShowValue</h5>
            <ShowValue />
          </div>
          <div class='block-'>
            <h5 class='title'>Step</h5>
            <Step />
          </div>
        </div>
      );
    };
  },
});
